<template>
	<view class="container" style="padding: 20rpx 30rpx;">
		<view class="qrcode d-flex just-content-center align-items-center">
			<canvas :style="{ width: qrcodeSize + 'px', height: qrcodeSize + 'px' }"
			 canvas-id="memberCode"></canvas>
		</view>
	</view>
</template>

<script>
	import {
		orderDetail
	} from "@/api/order.js";
	
	import {
		mapGetters
	} from "vuex";
	const qrCode = require('@/libs/weapp-qrcode.js');
	export default {
		data() {
			return {
				qrcodeSize: uni.upx2px(260)
			}
		},
		onShow() {
			if (this.isLogin) {
				// this.getOrderDetail();
				let params = {
					userId:this.userInfo.id,
					orderId:"1378264704161443842",
					type:0//0购卡 1 会员卡使用 2 门票
				}
				this.makeMemberCode(JSON.stringify(params))
			} else {
				this.login();
			}
		},
		computed: {
			...mapGetters('m_user',['isLogin', 'userInfo'])
		},
		methods: {
			login() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			makeMemberCode(text) {
				new qrCode('memberCode', {
					text: text,
					width: this.qrcodeSize,
					height: this.qrcodeSize,
					colorDark: '#333333',
					colorLight: '#FFFFFF',
					correctLevel: qrCode.CorrectLevel.H
				});
			},
			getOrderDetail: function() {
				let that = this;
				let orderType = "vip"; //   
				if(that.userVip && that.userVip.id === that.currentCard.id){
					orderType = "vip_up";
				}
				orderDetail(that.currentCard.id,orderType,that.currentStoreId).then(res => {
					// console.log(res);
				}, error => {
					uni.showToast({
						title: error
					})
				});
			},
		}
	};
</script>

<style lang="scss" scoped>
	
</style>
